<!-- 我的性别 -->
<template>
  <div id="Gender">
    <!-- 头部 -->
    <Head BackType1="1" title="性别"></Head>
    <div id="GenderBox">
      <div class="GenderTitle">选择你的性别</div>
      <van-radio-group v-model="radio">
        <van-cell-group>
          <van-cell title="男" clickable @click="radio = '1'">
            <van-radio @click="radioClick(1)" name="1" />
          </van-cell>
          <van-cell title="女" clickable @click="radio = '2'">
            <van-radio @click="radioClick(2)" name="2" />
          </van-cell>
          <van-cell title="保密" clickable @click="radio = '3'">
            <van-radio @click="radioClick(3)" name="3" />
          </van-cell>
        </van-cell-group>
      </van-radio-group>
    </div>
  </div>
</template>

<script>
  import { RadioGroup, Radio ,Cell ,CellGroup } from 'vant';
  import Head from "../components/Head"
  export default {
    data(){
      return{
        radio: '1'
      }
    },
    components:{
      Head,
      [RadioGroup.name]: RadioGroup,
      [Radio.name]: Radio,
      [Cell.name]: Cell,
      [CellGroup.name]: CellGroup
    },
    mounted(){
      /**
      * 我的性别
      */
     let usergender = this.$route.query.name;
      switch (usergender){
        case '男':
          this.radio = '1';
          break;
        case '女':
          this.radio = '2';
          break;
        case '保密':
          this.radio = '3';
          break;
      }
    },
    methods:{
      
      radioClick(index){
        let radio = this.radio
        /**
        * 修改性别
        */
        if(index == radio){

        }else{
          var gendertext={
            sex:index,
          }
          this.$post(urlConfig.editInfo,gendertext)
            .then(res => {
            console.log(res);
            var hasAmend = true;
            
          })
        }
      }
    },
  }
</script>

<style scoped lang="less">
  .van-cell{
    font-size: 32px !important;
  }
  #Gender{
    font-size: 28px;
    #GenderBox{
      position: fixed;
      top: 88px;
      .GenderTitle{
        padding: 20px 30px;
        width: 690px;
        color: #888;
        font-size: 24px;
        
      }
    }
  }
</style>
